<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">


	<p:dialog id="dialog" header="Sell ticket" modal="true"
		widgetVar="sellTicket" resizable="false">
		<h:form id="sellTicketForm">
			<p:messages id="sellTicketMessages" closable="true" />
			<p:panelGrid id="display" styleClass="noBorders">
				<p:row>
					<p:column colspan="5" styleClass="ui-widget-header">
						<h:outputText value="Select departure and destination stations" />
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputLabel for="tripID" value="Trip ID" />
					</p:column>
					<p:column>
						<p:inputText id="tripID" size="4" value="#{sellTicket.tripID}"
							readonly="true" />
					</p:column>
					<p:column>
						<h:outputLabel for="ticketsCount" value="Tickets" />
					</p:column>
					<p:column>
						<p:inputText id="ticketsCount" size="4"
							value="#{sellTicket.ticketsCount}" readonly="true" />
					</p:column>
					<p:column>
						<p:selectOneMenu id="tripStationA"
							value="#{sellTicket.selectedStationA}">
							<f:selectItem itemLabel="-- Select station A --" itemValue="" />
							<f:selectItems value="#{sellTicket.stationsA}" var="station"
								itemValue="#{station}" />
							<f:ajax listener="#{sellTicket.isSelectedStationA}"
								execute="@this" render="tripStationB sellTicketMessages" />
						</p:selectOneMenu>
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputLabel for="routeName" value="Route" />
					</p:column>
					<p:column colspan="3">
						<p:inputText id="routeName" size="30"
							value="#{sellTicket.routeName}" readonly="true" />
					</p:column>
					<p:column>
						<p:selectOneMenu id="tripStationB"
							value="#{sellTicket.selectedStationB}">
							<f:selectItem itemLabel="-- Select station B --" itemValue="" />
							<f:selectItems value="#{sellTicket.stationsB}" var="station"
								itemValue="#{station}" />
							<f:ajax listener="#{sellTicket.isSelectedStationB}"
								render="ticketsCount" />
						</p:selectOneMenu>
					</p:column>
				</p:row>
				<p:row>
					<p:column colspan="5">
						<p:spacer height="10" />
					</p:column>
				</p:row>
				<p:row>
					<p:column colspan="5" styleClass="ui-widget-header">
						<h:outputText
							value="Enter customer&apos;s information and press &quot;Sell&quot;" />
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputLabel for="surname" value="Surname" />
					</p:column>
					<p:column colspan="4">
						<p:inputText id="surname" value="#{sellTicket.surname}" />
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputLabel for="name" value="Name" />
					</p:column>
					<p:column colspan="4">
						<p:inputText id="name" value="#{sellTicket.name}" />
					</p:column>
				</p:row>
				<p:row>
					<p:column>
						<h:outputLabel for="birthday" value="Birthday" />
					</p:column>
					<p:column colspan="4">
						<p:calendar id="birthday" value="#{sellTicket.birthday}"
							pattern="yyyy-MM-dd" />
					</p:column>
				</p:row>
				<p:row>
					<p:column colspan="4">
						<p:spacer />
					</p:column>
					<p:column styleClass="alighRightColumnContents">
						<p:commandButton id="sellDialogButton" value="Sell"
							icon="ui-icon-cart">
							<f:ajax listener="#{sellTicket.sell}"
								execute="tripStationA tripStationB surname name birthday" />
						</p:commandButton>
					</p:column>
				</p:row>
			</p:panelGrid>
		</h:form>
	</p:dialog>

</ui:composition>